<!DOCTYPE html>
<title>Tests mouse interactions on a non-custom composited div scrollbar thumb.</title>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../resources/gesture-util.js"></script>
<script src="../../../resources/scrollbar-util.js"></script>
<style>
.appearance {
  width: 100px;
  height: 100px;
  overflow: scroll;
  border: 1px solid black;
}
.standardLocation {
  position: absolute;
  top: 100px;
  left: 100px;
}
.space {
  height: 150px;
  width: 150px;
}
</style>

<!-- Composited non-custom scroller -->
<div id="standard" class="appearance standardLocation">
  <div class="space"></div>
</div>

<script>
if (window.internals)
    internals.settings.setScrollAnimatorEnabled(false);

window.onload = () => {
  const standardDivFast = document.getElementById("standard");
  const standardRectFast = standardDivFast.getBoundingClientRect();

  const TRACK_WIDTH = calculateScrollbarThickness();
  const BUTTON_WIDTH = TRACK_WIDTH;

  promise_test (async () => {
    await waitForCompositorCommit();
    resetScrollOffset(standardDivFast);

    // Testing the vertical scrollbar thumb.
    let x = standardRectFast.right - TRACK_WIDTH / 2;
    let y = standardRectFast.top + BUTTON_WIDTH + 2;

    await mouseMoveTo(x, y);
    await mouseDownAt(x, y);
    assert_equals(standardDivFast.scrollTop, 0, "Mousedown on vertical scrollbar thumb is not expected to scroll.");

    await mouseMoveTo(x, y-10);
    assert_equals(standardDivFast.scrollTop, 0, "Vertical thumb drag beyond the track should not cause a scroll.");

    await mouseMoveTo(x, y);
    assert_equals(standardDivFast.scrollTop, 0, "Vertical thumb drag beyond the track and back should not cause a scroll.");
    await mouseUpAt(x, y);
  }, "Test thumb drags beyond scrollbar track.");
}
</script>
